/** */

<template>
  <a-input :placeholder="placeholder" v-model="valuePro" />
</template>

<script>
import { Input } from 'ant-design-vue'

export default {
  name: 'myInput2',
  components: {
    AInput: Input,
  },
  model: {
    prop: 'value',
    event: 'change',
  },
  props: {
    value: String,
    placeholder: String,
  },
  data() {
    return {
      valuePro: undefined,
    }
  },
  computed: {
    currentValue: {
      get() {
        return this.value
      },
      set(newValue) {
        this.$emit('input', newValue)
      },
    },
  },
  watch: {
    currentValue: {
      deep: true,
      immediate: true,
      handler: function (newValue) {
        this.valuePro = newValue
        if (newValue !== undefined) {
          this.$emit('change', newValue)
        }
      },
    },
  },

  methods: {},
}
</script>

<style></style>
